Soy un principiante absoluto, he estudiado por mi cuenta durante dos semanas en preparación para un campo de entrenamiento que se avecina en un mes. En un esfuerzo por mejorar mis habilidades y "aprender a pensar como un desarrollador", asumí un proyecto que intenta resolver un problema del mundo real. Mi esposa tiene un negocio que le exige generar facturas para sus clientes. Estoy intentando usar HTML y JavaScript para crear una aplicación basada en la web que le permita crear rápidamente facturas personalizadas en lugar de escribirlas manualmente cada vez. En la versión actual, un mensaje le solicita un número. Este número genera un número igual de filas de tres columnas en HTML. Esto le permite personalizar la factura con el número exacto de campos que necesita. La columna 1 contiene el nombre del producto. En la misma fila, la columna 2 contiene el recuento de unidades, mientras que la columna 3 contiene el costo total de ese producto, que es el precio base multiplicado por el recuento de unidades. Quiero que este cálculo se produzca al hacer clic en un botón. Pero estoy atascado. Para realizar las matemáticas, necesito poder obtener los números enteros de cada fila y columna y pasarlos a una función. Pero debido a que cada fila y columna se generó automáticamente, no tienen atributos únicos y, por lo tanto, no pueden identificarse. Puedo realizar las matemáticas en cada columna, pero no en cada fila. Como soy tan nuevo, y solo aprendí de un par de cursos introductorios de Codecademy y algunos videos de YouTube, no sé cómo evaluar si estoy abordando el proyecto completamente mal, o si hay algún truco que me falta, o si hay algo que aún no he aprendido. Si alguien con cierta experiencia pudiera orientarme en la dirección correcta, ¡realmente lo agradecería! Adjunté todo el código a esta publicación. Disculpas si es un desastre horrible. ¡Ten cuidado conmigo, soy un principiante! const invDate = Fecha (); var field = " " + " " + "
"; document.getElementById ('newInvoice'). onclick = function () { let invoicedName = prompt ('¿A quién se extiende esta factura?', 'Ingrese un nombre'); let productFields = Number (prompt ('¿Cuántos nombres de productos hay en esta factura?', 'Introduzca un número')); dejar campos = '' deja dynHtml = '' if (invoicedName! = null && productFields! = null) { para (sea i = 1; i <= productFields; i ++) { campos + = campo}; } else {alert ('Ingrese entradas válidas.'); }; dynHtml = ""; document.write (dynHtml); document.getElementById ('calcular'). onclick = function getQtyFields () { let qtyInputs = document.getElementsByName ('cantidad'), resultQty = 0; para (sea j = 0; j ![]()
" + "FACTURA
" + "Preparado para: " + invoicedName + ", el" + "
" + invDate + "
" + campos + "
" + "
2020-12-15 08:13:22
Como dijiste, tu problema principal es encontrar una manera de dar a cada campo de entrada dentro de su propia fila su propio identificador único. De esta forma, puede calcular el precio de cada fila e insertarlo en el campo de precio. Primero tienes que empezar con los campos: var field = " " + " " + "
"; document.getElementById ('newInvoice'). onclick = function () { ... para (sea i = 1; i <= productFields; i ++) { campos + = campo}; ... }; Cada grupo necesita su propio identificador. De esa manera, puede consultar más tarde cada entrada en cada fila para calcular el precio subtotal. El atributo de clase es algo que puede asignar a varios elementos para hacer referencia a ellos más adelante. Esta clase puede ser cualquier cosa siempre que no entre en conflicto con la clase de ninguna otra fila. Puede usar la i del bucle como su identificador, ya que cambia con cada bucle. para (sea i = 1; i <= productFields; i ++) { var field = " " + " " + "
"; campos + = campo }; Esto agregará la fila de clase- {i} a cada campo en cada fila. Mejor aún, puede refactorizar esto en su propia función function generateFields (i) { return " " + " " + "
"; } para (sea i = 1; i <= productFields; i ++) { campos + = generateFields (i); }; Obtienes algo similar al siguiente htmlCantidad:
Ahora, en su función de cálculo, puede consultar estas filas y calcular su precio. Aquí puede recorrer los campos de entrada del 'elemento'. document.getElementById ('calcular'). onclick = function getQtyFields () { let itemInputs = document.getElementsByName ('elemento') para (sea i = 0; i) para (sea i = 0; i